import Taro from '@tarojs/taro'
import React,{useState} from 'react'
import { View, Image, Text, ScrollView,} from '@tarojs/components'
import './projectInf.less'
import { AtTabs, AtTabsPane } from 'taro-ui'
import "taro-ui/dist/style/components/tabs.scss";


export default function projectInf() {

  const [current,setCurrent]=useState(0);
  const tabList = [{ title: '图文详情' }, { title: '体检项目' }];

  // table选项的事件
  const handleClick=(value)=>{
    console.log(111)
    setCurrent(value)
  }
// 跳转到payAdd
  const goPayAdd=()=>{
    Taro.navigateTo({
      url:'../YXX/payAdd/payAdd',
  })
  }


  return (
    <View className="box">
        <View className="box-1">
          <Image src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Finews.gtimg.com%2Fnewsapp_match%2F0%2F11990639340%2F0.jpg&refer=http%3A%2F%2Finews.gtimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1631681383&t=5714276ac83c445dda6aedf3a985dd0c"></Image>
        </View>
        <View className="box-2">
            <View className="line1">男士体检套餐</View>
            <View className="line2">南方医科大学附属第三医院</View>
            <View className="line3">
              <View className="line3-1">
                <Text>￥998</Text>
                <Text className="oldPrice">￥1200</Text>
              </View>
              <View className="line3-2">
                <Text className="num">销量 234</Text>
              </View>
            </View>
        </View>
        <AtTabs current={current} tabList={tabList} onClick={handleClick} className="listTitle">
          <AtTabsPane current={current} index={0} >
            <View className="box-3">
              <View className="title">套餐介绍</View>
              <View className="con">60岁以上的女性长者，为相关科室诊断提供重要依据</View>
              <View className="pic">
                <Image src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Finews.gtimg.com%2Fnewsapp_match%2F0%2F11990639340%2F0.jpg&refer=http%3A%2F%2Finews.gtimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1631681383&t=5714276ac83c445dda6aedf3a985dd0c"></Image>
              </View>
              <View className="title2">使用规则</View>
              <View className="con2">
                <View>1、请至少提前一天预定；</View>
                <View>2、线上预约完后，体检日拿身份证到医院前台等级即可开始体检；</View>
                <View>3、医院提供营养早餐一份；</View>
              </View>
            </View>
          </AtTabsPane>
          <AtTabsPane current={current} index={1}>
            <View className="box-4">
              <View><Text>项目名称：</Text><Text>一般情况</Text></View>
              <View>项目介绍：</View>
              <View>身高、体重、血压、脉搏、胸部（心脏、双肺、胸腔）、腹部</View>
            </View>
            <View className="box-4">
              <View><Text>项目名称：</Text><Text>一般情况</Text></View>
              <View>项目介绍：</View>
              <View>身高、体重、血压、脉搏、胸部（心脏、双肺、胸腔）、腹部</View>
            </View>
            <View className="box-4">
              <View><Text>项目名称：</Text><Text>一般情况</Text></View>
              <View>项目介绍：</View>
              <View>身高、体重、血压、脉搏、胸部（心脏、双肺、胸腔）、腹部</View>
            </View>
          </AtTabsPane>
        </AtTabs>
        <View className="box-5">
          <View className="title">适用机构</View>
          <ScrollView enable-flex scrollX className="scrollBox">
            <View className="item">
              <Image src='https://gss0.baidu.com/70cFfyinKgQFm2e88IuM_a/forum/w=580/sign=567d0263d9c451daf6f60ce386fc52a5/2b138e529822720e415b78c77fcb0a46f31fab5e.jpg'>
              </Image>
              <View>南方医科大学附属第三医院</View>
              <View className="line"><Text>120人预约</Text><Text className="line-1">约5.0千米</Text></View>
            </View>
            <View className="item">
              <Image src='https://gss0.baidu.com/70cFfyinKgQFm2e88IuM_a/forum/w=580/sign=567d0263d9c451daf6f60ce386fc52a5/2b138e529822720e415b78c77fcb0a46f31fab5e.jpg'>
              </Image>
              <View>南方医科大学附属第三医院</View>
              <View className="line"><Text>120人预约</Text><Text className="line-1">约5.0千米</Text></View>
            </View>
            <View className="item">
              <Image src='https://gss0.baidu.com/70cFfyinKgQFm2e88IuM_a/forum/w=580/sign=567d0263d9c451daf6f60ce386fc52a5/2b138e529822720e415b78c77fcb0a46f31fab5e.jpg'>
              </Image>
              <View>南方医科大学附属第三医院</View>
              <View className="line"><Text>120人预约</Text><Text className="line-1">约5.0千米</Text></View>
            </View>
            <View className="item">
              <Image src='https://gss0.baidu.com/70cFfyinKgQFm2e88IuM_a/forum/w=580/sign=567d0263d9c451daf6f60ce386fc52a5/2b138e529822720e415b78c77fcb0a46f31fab5e.jpg'>
              </Image>
              <View>南方医科大学附属第三医院</View>
              <View className="line"><Text>120人预约</Text><Text className="line-1">约5.0千米</Text></View>
            </View>
            <View className="item">
              <Image src='https://gss0.baidu.com/70cFfyinKgQFm2e88IuM_a/forum/w=580/sign=567d0263d9c451daf6f60ce386fc52a5/2b138e529822720e415b78c77fcb0a46f31fab5e.jpg'>
              </Image>
              <View>南方医科大学附属第三医院</View>
              <View className="line"><Text>120人预约</Text><Text className="line-1">约5.0千米</Text></View>
            </View>
          </ScrollView>
        </View>
        <View className="box-6">
            <Text>￥998</Text>
            <Text onClick={goPayAdd}>预约购买</Text>
        </View>
    </View>
  )
}